import 'package:f_demo/ui/pages/index.dart';
import 'package:f_demo/ui/widgets/index.dart';
import 'package:f_demo/utils/index.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:f_demo/bloc/index.dart';
import 'package:f_demo/commons/index.dart';
import 'package:f_demo/generated/i18n.dart';
import 'package:f_demo/res/colors.dart';
import 'package:f_demo/res/index.dart';
import 'package:f_demo/ui/pages/demo/index.dart';
import 'package:shared_preferences/shared_preferences.dart';

class SettingPage extends StatefulWidget {
  @override
  _SettingPageState createState() => _SettingPageState();
}

class _SettingPageState extends State<SettingPage> {
  ThemeBloc themeBloc;
  LanguageBloc languageBloc;
  var prefs;
  String shareLanguage;

  @override
  initState() {
    themeBloc = BlocProvider.of<ThemeBloc>(context);
    languageBloc = BlocProvider.of<LanguageBloc>(context);
    _getShare();
    super.initState();
  }

  _getShare() async {
    prefs = await SharedPreferences.getInstance();
    setState(() {
      shareLanguage = prefs.getString(Share.language);
    });
  }

  updateTheme(String key) async {
    prefs.setString(Share.primaryColor, key);
    themeBloc.dispatch(UpdateThemeEvent(color: key));
  }

  _updateBrightness(bool value) async {
    prefs.setBool(Share.brightness, value);
    themeBloc.dispatch(UpdateBrightnessEvent(brightness: value));
  }

  _updateLanguage(String value) async {
    prefs.setString(Share.language, value);
    _getShare();
    languageBloc.dispatch(UpdateLanguageEvent(local: value));
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: BlocBuilder<ThemeBloc, ThemeState>(
        builder: (context, themeState) {
          return Column(
            children: <Widget>[
              _Header(),
              ListTile(
                title: Text(I18n.of(context).dark_model),
                leading: Icon(Icons.add_to_home_screen),
                trailing: Switch(
                  value: themeState.brightness == Brightness.dark,
                  onChanged: (val) {
                    _updateBrightness(val);
                  },
                ),
              ),
              _Language(
                updateLanguage: _updateLanguage,
                shareLanguage: shareLanguage,
              ),
              _PrimaryColor(updateTheme: updateTheme),
              ListTile(
                title: Text('Animation'),
                leading: Icon(Icons.transform),
                trailing: Icon(Icons.navigate_next),
                onTap: () {
                  Navigator.push(context, MaterialPageRoute(builder: (context) => AnimationDemo()));
                },
              )
            ],
          );
        },
      ),
    );
  }
}

class _Header extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Stack(
      children: <Widget>[
        BgArcWidget(bgColor: Theme.of(context).primaryColor),
        Positioned(
          top: ScreenUtil().setHeight(100),
          left: ScreenUtil().setWidth(305),
          child: InkWell(
            onTap: (){Navigator.of(context).push(FadeRoute(page: LoginPage()));},
            child: Column(
              children: <Widget>[
                Hero(
                  tag: 'user_avatar',
                  child: CircleAvatar(
                    radius: ScreenUtil().setWidth(70),
                    child: ClipRRect(
                      borderRadius: BorderRadius.all(Radius.circular(ScreenUtil().setWidth(80))),
                      child: Image.network('https://gitee.com/xushuai1231/images/raw/master/icon-1024.png'),
                    ),
                  ),
                ),
                Text('点我登录', style: TextStyle(color: Colors.white, height: 3, fontSize: 18))
              ],
            ),
          ),
        )
      ],
    );
  }
}


class _Language extends StatelessWidget {
  final Function updateLanguage;
  final String shareLanguage;

  const _Language({Key key, @required this.updateLanguage, @required this.shareLanguage}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return ExpansionTile(
      title: Text(I18n.of(context).language),
      leading: Icon(Icons.language),
      backgroundColor: Color.fromRGBO(240, 240, 240, .5),
      children: localeMap.keys
          .map((key) => ListTile(
                title: Text(
                  '${localeMap[key]}',
                  style: TextStyles.listContent,
                ),
                trailing: shareLanguage == key
                    ? Icon(
                        Icons.check,
                        color: Theme.of(context).primaryColor,
                      )
                    : SizedBox(),
                onTap: () {
                  updateLanguage(key);
                },
              ))
          .toList(),
    );
  }
}

class _PrimaryColor extends StatelessWidget {
  final Function updateTheme;

  const _PrimaryColor({Key key, this.updateTheme}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return ExpansionTile(
      title: Text(I18n.of(context).theme),
      leading: Icon(Icons.color_lens),
      children: [
        Container(
          padding: EdgeInsets.all(15),
          width: ScreenUtil().setWidth(750),
          child: Wrap(
            alignment: WrapAlignment.spaceBetween,
            spacing: 5,
            runSpacing: 5,
            children: themeColorMap.keys
                .map((key) => InkWell(
                      onTap: () {
                        updateTheme(key);
                      },
                      child: Container(
                        width: (ScreenUtil().setWidth(750) - 30 - 5 * 7) / 8,
                        height: (ScreenUtil().setWidth(750) - 30 - 5 * 7) / 8,
                        color: themeColorMap[key],
                      ),
                    ))
                .toList(),
          ),
        )
      ],
    );
  }
}
